<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta name="keywords" content="实地圈  实地圈公司  实地圈有限公司 深圳市实地圈科技有限公司 ">
<meta name="description" content="共享经济app">

<script src="jq/jquery-1.8.3.min.js"></script>
<script src="jq/jquery.fullPage.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/animate.min.css">
<link rel="stylesheet" href="css/jquery.fullPage.css">
<link href="./css/videoTest.css" rel="stylesheet">
<script src="./js/videoTest.js"></script>

<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="shortcut icon" href="./images/logo.ico" type="image/x-icon"/>


<style>
    .fp-controlArrow .fp-prev {
    left: 15px;
    width: 0;
    border-width: 38.5px 34px 38.5px 0;
    border-color: red;
}
    
    </style>
<!--引用百度地图API-->
<style type="text/css">
    html,body{margin:0;padding:0;}
    .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
    .iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
<!-- 自动识别start--->
		<script type="text/javascript">
         var mobileAgent = new Array("iphone", "ipod", "ipad", "android", "mobile", "blackberry", "webos", "incognito", "webmate", "bada", "nokia", "lg", "ucweb", "skyfire");
         var browser = navigator.userAgent.toLowerCase(); 
         var isMobile = false; 
         for (var i=0; i<mobileAgent.length; i++){ 
             if (browser.indexOf(mobileAgent[i])!=-1){ 
		          isMobile = true;
                  break;
             }
         }
        console.log(isMobile);
        if(isMobile){
            location.href = 'indexPhone.html';
        }
        </script>

		<!-- 自动识别end-->
<head>
	<title>深圳实地圈科技有限公司</title>
</head>

<script>
$(function(){
	$('#dowebok').fullpage({
		sectionsColor: ['#2bcd81', '#ffffff', '#ffffff', '#f7f7f7','ffffff'],
		'navigation': true,
		anchors: ['page1', 'page2', 'page3', 'page4', 'page5'],
		menu: '#menu',
        'loopHorizontal':true,
		afterLoad: function(anchorLink, index){
			if(index==1){
				//翻到第一页
				$('#move1').addClass('animated bounceInLeft');
			    setTimeout(function(){
			        $('#move1').removeClass('animated bounceOutLeft');
			        $('#move1').addClass('animated bounceInLeft');
			    }, 1);
			}
			if(index==2){
				//翻到第二页
				$('#move2').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move2').removeClass('fadeOutUp');
			    }, 1);
			    $('#move3').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move3').removeClass('fadeOutUp');
			    }, 300);

			    $('#move4').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move4').removeClass('fadeOutUp');
			    }, 1);
			    $('#move5').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move5').removeClass('fadeOutUp');
			    }, 1000);
			     $('#move6').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move6').removeClass('fadeOutUp');
			    }, 1);
			    $('#move7').addClass('fadeInUpBig');
			    setTimeout(function(){
			    	$('#move7').removeClass('fadeOutUp');
			    }, 1000);

			}
			if(index == 1){
				//从第一页翻到第二页
				$("#menu").removeClass('mainposnav_a');
				$("#menu").removeClass('mainposnav_b');
				$("#menu").addClass('mainposnav_a');
			}else{
				//从第二页翻到第一页
				$("#menu").removeClass('mainposnav_a');
				$("#menu").removeClass('mainposnav_b');
				$("#menu").addClass('mainposnav_b');
			}
			//导航ON
			top_index="#top"+index;
			$(top_index).removeClass('off');
			$(top_index).removeClass('on');
			$(top_index).addClass('on');

		},
		onLeave: function(index, nextIndex, direction){
			var leavingSection = $(this);

			//after leaving section 2
			if(index == 1 && direction =='down'){
				//从第一页翻到第二页
				$("#menu").removeClass('mainposnav_a');
				$("#menu").removeClass('mainposnav_b');
				$("#menu").addClass('mainposnav_b');
			}
			else if(index == 2 && direction == 'up'){
				//从第二页翻到第一页
				$("#menu").removeClass('mainposnav_a');
				$("#menu").removeClass('mainposnav_b');
				$("#menu").addClass('mainposnav_a');

			}

			if(index==1){
				//离开第一页，第一页的动态元素恢复位置并隐藏
				
			    $('#move1').addClass('animated bounceOutLeft');
			    setTimeout(function(){
			        $('#move1').removeClass('bounceInLeft');
			    }, 1);
			}
			if(index==2){
				//翻到第二页，第二页的动态元素恢复位置并隐藏
				$('#move2').addClass(' fadeOutUp');
			    setTimeout(function(){
			    	$('#move2').removeClass('fadeInUpBig');
			    }, 1);
			    $('#move3').addClass('fadeOutUp');
			    setTimeout(function(){
			    	$('#move3').removeClass('fadeInUpBig');
			    }, 300); 
			    $('#move4').addClass('fadeOutUp');
			    setTimeout(function(){
			    	$('#move4').removeClass('fadeInUpBig');
			    }, 1);
			    $('#move5').addClass('fadeOutUp');
			    setTimeout(function(){
			    	$('#move5').removeClass('fadeInUpBig');
			    }, 1000);  
			    $('#move6').addClass('fadeOutUp');
			    setTimeout(function(){
			    	$('#move6').removeClass('fadeInUpBig');
			    }, 1); 
			    $('#move7').addClass('fadeOutUp');
			    setTimeout(function(){
			    	$('#move7').removeClass('fadeInUpBig');
			    }, 1000); 
			    
			}
			//导航OFF
			top_index="#top"+index;
			$(top_index).removeClass('off');
			$(top_index).removeClass('on');
			$(top_index).addClass('off');
		}
	});
});
</script>
<script>
$(function(){
	$(".mainMenuNav ul li a").click(function () {
        $(".mainMenuNav ul li a").removeClass("on").addClass("off");
        $(this).removeClass("off").addClass("on");
    });
});

</script>
<body>
<div class="mainposnav mainposnav_a" id="menu">
	<div class="mainwrap mainMenuBox">
		<div class="logo2"></div>
		<div class="mainMenuNav">
			<ul >
				<li data-menuanchor="page1"><a id="top1" href="#page1" class="on">首页</a></li>
                <li data-menuanchor="page2"><a id="top2" href="#page2" class="off">APP介绍</a></li>
				<li data-menuanchor="page3"><a id="top3" href="#page3" class="off">关于我们</a></li>
				<li data-menuanchor="page4"><a id="top4" href="#page4" class="off">联系我们</a></li>
				<li data-menuanchor="page5"><a id="top5" href="#page5" class="off">免费下载</a></li>
				<li><a class="ftfff off" href="./joinUs.html">代理加盟</a></li>
			</ul>
		</div>
	</div>
</div>
<div id="dowebok">
	<div class="section bg2b">
		<div class="mainwrap">
			<div class="mainIndxl">
				<i class="bg-one animated bounceInLeft" id="move1"></i>
			</div>
			<div class="mainIndxr">
				<h1 class="colfff">实地圈</h1>
				<span class="colfff">
					一款专为本地商家<br>与本地百姓互联的移动APP
				</span>
				<a href="#page5"></a>
				<img id="appcodeImg" src="images/appcode.png">
				<p class="colfff">扫描二维码免费体验</p>
			</div>
		</div>
	</div>
	<div class="section">
      <div class="slide slide1">
      

           <div class="pubpostbox">
                <div class="twobgbox">
                    <i class="twobg1"></i>
                    <i class="twobg2"></i>
                    <i class="twobg3"></i>
                </div>
                <div class="mainIntroduceBox">
                    <div class="mainwrap">
                        <h2 class="col333 twoh2">APP介绍</h2>
                        <span class="twospan col999">实地圈是一款基于地理位置的共享经济移动软件</span>
                        <div class="jiange"></div>
                        <div class="broadcast">
                           
                            <video id="video"  class="video-js vjs-default-skin " controls   loop
                                  data-setup='{"example_option":true}'>
                                 <source src=".//video/advr.mp4" media="only screen and (min-device-width: 568px)"></source>
                                <source src="./advr.mp4" media="only screen and (max-device-width: 568px)"></source> 

                            </video>


                            <a class="play-btn"></a>
                            <div class="close">
                                  <img class="close_icon" src="./images/close_icon.png" alt="">
                                 </div>
                        </div>
                    </div>
                </div>

           </div>
            
        </div>
	     <div class="slide slide2">
            <div class="pubpostbox">
                <div class="twobgbox">
                    <i class="twobg1"></i>
                    <i class="twobg2"></i>
                    <i class="twobg3"></i>
                </div>
               
                <div class="mainIntroduceBox">
                    <div class="mainwrap">
                        <h2 class="col333 twoh2">APP介绍</h2>
                        <span class="twospan col999">实地圈是一款基于地理位置的共享经济移动软件</span>
                             <div class="mainIntroduceCon ">

                                <div class="mainIntroducel" >
                                    <i class="miico01 animated fadeInUpBig" id="move4"></i>
                                    <i class="miico02 animated fadeInUpBig" id="move5"></i>
                                    <i class="miico03 animated fadeInUpBig" id="move6"></i>
                                    <i class="miico04 animated fadeInUpBig" id="move7"></i>
                                </div>
                                <div class="mainIntroducer">
                                    <i class="miico05 animated bounceOutLeft" id="move2"></i>
                                    <i class="miico06 animated bounceOutLeft" id="move3"></i>
                                </div>
                            </div>
                    </div>
                </div>
           </div>
       
    </div>
   
	</div>
	<div class="section">
		<div class="threetopwrap bgf0f">
			<div class="mainwrap mainAboutTop">
				<div class="aboutLogo"></div>
				<p class="col666">
				实地圈是深圳市实地圈科技有限公司打造<br>
				的一款基于地理位置的共享经济移动软件。实地圈科技立志打造成最具社会价值的共享经济平台，<br> 
				为百姓和商家提供一个价值实现、便民便捷、信息透明共享的平台；让移动互联网更深一步的走进百姓家，为百姓带来更多实用的价值。 
				</p>
				<i class="aboutHorn"></i>
			</div>
		</div>
		<div class="clears"></div>
		<div class="threebomwrap">
			<div class="mainwrap mainAboutBut">
				<div class="mainAboutcon">
					<ul>
						<li>
							<img src="images/leader1.png">
							<em class="col333">李文强</em>
							<div class="per-top-lc-introduce">
	                        	 <p>联合创始人/董事长</p>
	                           <p>莲和剑控股投资集团董事长，魅力四射投资管理集团董事长,广东省陆丰市政协委员</p>
	                        </div>
						</li>
						<li>
							<img src="images/leader2.jpg">
							<em class="col333">梁观海</em>
							<div class="per-top-lc-introduce">
	                        	 <p> 联合创始人/CEO</p>
	                           	 <p>实地圈创始人，连续创业者，在互联网创业浪潮中，带领实地圈团队走向又一次创业</p>
	                        </div>
						</li>
						<li>
							<img src="images/leader3.png">
							<em class="col333">王仁洁</em>
							<div class="per-top-lc-introduce">
	                        	 <p>联合创始人/CTO</p>
	                           	 <p>曾任深圳华宏联创科技有限公司 iOS技术总监，北京搜谷科技有限公司 iOS技术总监 </p>	                 
	                        </div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="section" >
		<div class="mainContainBox">
			<div class="mainwrap">
				<div class="mainContainCon">
					<ul>
						<li>
							<i class="wxico"></i>
							<span class="col666">手机号:400-886-7938</span>
						</li>
						<li>
							<i class="emailico"></i>
							<span class="col666">liangguanhai@shidiquan.com</span>
						</li>
						<li>
							<i class="addressico"></i>
							<span class="col666">深圳市龙华新区龙华街道清泉路与三联路交叉口魅力四射文化楼9楼</span>
						</li>
					</ul>
				</div>
				<div class="mainMapbox" >
					<div class="map" id="dituContent"></div>
				</div>
			</div>
		</div>
	</div>
	<div class="section">
		<div class="fivebox">
			<div class="box-seven sec-3">
	            <h2>根据手机，选择下载</h2>
	            <ul class="clearfix">
	                <li class="down">
	                    <a href="javascript:void(0)"  target="_blank" class="ciqclickbtn ios-download-btn">
	                        <i class="icon ios"></i>
	                        <p class="">iPhone</p>
	                        <span class=""></span>
	                    </a>
	                </li>
	                <li class="down-android">
	                  <a href="javascript:void(0)" download="shidiquan_release.apk" target="_blank" class="ciqclickbtn android-download-btn">
	                        <i class="icon android"></i>
	                        <p class="">Android</p>
	                        <span class=""></span>
	                    </a>
	                </li>
	                <li class="ewm-box">
	                    <dl>
	                        <dt class="ewms"></dt>
	                        <dd>扫码下载</dd>
	                    </dl>
	                </li>
	            </ul>
	            <div class="join">
	                <div class="join-img">
	                    <img class="join-bgimg" src="./images/join.png" alt="">
	                    <a href="./joinUs.html"><img id="join-jump-img" src="./images/more-btn.png" alt=""></a>
	                </div>
	            </div>
	        </div>
		</div>
	</div>
</div>
<script src="./js/settings.js"></script>
<script type="text/javascript">
    
    

   $(function(){
         $(".ios-download-btn").on("click",function(){
            location.href=SYS_GLOBAL_CONFIG.ios_down;    
         });
            $(".android-download-btn").on("click",function(){
           location.href=SYS_GLOBAL_CONFIG.android_down;    
        });
       
       $("#join-jump-img").on("mouseover",function(){
           console.log("test");
            $(this).attr("src","./images/click-more-btn.png");
       });
       $("#join-jump-img").on("mouseout",function(){
            console.log("2");
            $(this).attr("src","./images/more-btn.png");
       });
       
        $(".play-btn").click(function(){
            $(this).css("display","none");
            $("#video").css("display","block");
            $("#video").animate({left:"0px",width:'100%',height:'100%'},200);
             var t=setTimeout(function(){
                $(".close").css("display","block");
           },200);
            
            $("#video_html5_api")[0].play();
          
        });

       $(".close").click(function(){
        $(this).css("display","none");
        $("#video").animate({left:"250px",width:'300px',height:'300px'},200);
           var t=setTimeout(function(){
                $("#video").css("display","none");
           },200);

        $(".play-btn").css("display","block");
           $("#video_html5_api")[0].pause();
       });
 
    });
   
    
$(document).ready(function() {
	$(".fivebox li .ios-download-btn").hover(function(){
		$(".fivebox li .ios-download-btn span").toggleClass("active");
		$(".fivebox li .ios-download-btn .icon").toggleClass("on");
		$(".fivebox li .ios-download-btn p").toggleClass("on");
	});
	$(".fivebox li .android-download-btn").hover(function(){
		$(".fivebox li .android-download-btn span").toggleClass("active");
		$(".fivebox li .android-download-btn .icon").toggleClass("on");
		$(".fivebox li .android-download-btn p").toggleClass("on");
	});
});
</script>
<script type="text/javascript">
  
    
    //创建和初始化地图函数：
    function initMap(){
        createMap();//创建地图
        setMapEvent();//设置地图事件
        addMapControl();//向地图添加控件
        addMarker();//向地图中添加marker
    }
    
    //创建地图函数：
    function createMap(){
        var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
        var point = new BMap.Point(114.039205,22.671274
);//定义一个中心点坐标
        map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器中
        window.map = map;//将map变量存储在全局
    }
    
    //地图事件设置函数：
    function setMapEvent(){
        map.enableDragging();//启用地图拖拽事件，默认启用(可不写)
        map.enableScrollWheelZoom();//启用地图滚轮放大缩小
        map.enableDoubleClickZoom();//启用鼠标双击放大，默认启用(可不写)
        map.enableKeyboard();//启用键盘上下左右键移动地图
    }
    
    //地图控件添加函数：
    function addMapControl(){
        //向地图中添加缩放控件
	var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
	map.addControl(ctrl_nav);
        //向地图中添加缩略图控件
	var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
	map.addControl(ctrl_ove);
        //向地图中添加比例尺控件
	var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
	map.addControl(ctrl_sca);
    }
    
    //标注点数组
    var markerArr = [{title:"深圳市实地圈科技有限公司",content:"我的备注",point:"114.039205|22.671274"
,isOpen:0,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}}
		 ];
    //创建marker
    function addMarker(){
        for(var i=0;i<markerArr.length;i++){
            var json = markerArr[i];
            var p0 = json.point.split("|")[0];
            var p1 = json.point.split("|")[1];
            var point = new BMap.Point(p0,p1);
			var iconImg = createIcon(json.icon);
            var marker = new BMap.Marker(point,{icon:iconImg});
			var iw = createInfoWindow(i);
			var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
			marker.setLabel(label);
            map.addOverlay(marker);
            label.setStyle({
                        borderColor:"#808080",
                        color:"#333",
                        cursor:"pointer"
            });
			
			(function(){
				var index = i;
				var _iw = createInfoWindow(i);
				var _marker = marker;
				_marker.addEventListener("click",function(){
				    this.openInfoWindow(_iw);
			    });
			    _iw.addEventListener("open",function(){
				    _marker.getLabel().hide();
			    })
			    _iw.addEventListener("close",function(){
				    _marker.getLabel().show();
			    })
				label.addEventListener("click",function(){
				    _marker.openInfoWindow(_iw);
			    })
				if(!!json.isOpen){
					label.hide();
					_marker.openInfoWindow(_iw);
				}
			})()
        }
    }
    //创建InfoWindow
    function createInfoWindow(i){
        var json = markerArr[i];
        var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
        return iw;
    }
    //创建一个Icon
    function createIcon(json){
        var icon = new BMap.Icon("http://app.baidu.com/map/images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
        return icon;
    }
    
    initMap();//创建和初始化地图
    
   
</script>
</body>
</html>
